.mega-sheet.password-generator .sheet {
    cursor: default;
    width: 494px;
    --mobile-elem-max-width: 494px;
    background: var(--mobile-page-background);
}
.password-preview {
    box-sizing: border-box;
    position: relative;
    min-height: 144px;
    background-color: var(--mobile-surface-1);
    border: 1px var(--mobile-border-subtle) solid;
    border-radius: var(--mobile-border-radius-medium);
    padding: 16px;
    text-align: start;
}
.password-preview .letter,
.password-colorized .letter {
    color: var(--mobile-text-primary);
}
.password-preview .number,
.password-colorized .number {
    color: var(--mobile-indicator-magenta);
}
.password-preview .special,
.password-colorized .special {
    color: var(--mobile-indicator-indigo);
    white-space: pre;
}
.password-preview p {
    margin: 0;
    line-break: anywhere;
}
.password-preview span {
    font: var(--font-password-preview);
    letter-spacing: 2px;
}

.copy-wrapper {
    display: flex;
    justify-content: flex-end;
    position: absolute;
    right: 6px;
    bottom: 16px;
}
.password-copy {
    padding: 0;
    height: 24px;
}

.strength-checker {
    display: flex;
    align-items: center;
    padding-top: 4px;
}
.strength-checker.moderate,
.account.password-status.moderate {
    color: var(--mobile-text-warning);
}
.strength-checker.weak,
.mega-input .account.password-status.weak {
    color: var(--mobile-text-error);
}
.strength-checker .strength-icon {
    margin-right: 8px;
}
.password-generator .mega-input input:focus {
    padding: 12px !important;
}
.mega-sheet.overlay-wrap.password-generator .actions .button {
    width: auto;
}
.mega-sheet.overlay-wrap.password-generator .actions {
    padding-top: 16px;
}
.mega-sheet.password-generator i.icon {
    --icon-size: 24px;
}

/* Overridden component styles for webclient layout */
.mega-sheet.password-generator .sheet {
    border-radius: var(--mobile-border-radius-large);
    margin: auto;
}
